<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<button type="button" onclick="callArkTS()">Click Me 1!</button>
<p id="demo"></p>

<button type="button" onclick="callArkTS2()">Click Me 2!</button>
<p id="demo2"></p>
<button type="button" onclick="callArkTS3()">Click Me 3!</button>
<p id="demo3"></p>
<button type="button" onclick="callArkTS4()">Click Me 4!</button>
<p id="demo4"></p>
<button type="button" onclick="callArkTS5()">Click Me 5!</button>
<p id="demo5"></p>

<button onclick="addItems()">增加列表项</button>
<ul id="myList">
    <li>列表项 1</li>
    <li>列表项 2</li>
    <li>列表项 3</li>
</ul>

<script>
    function callArkTS() {
        let str = testObjName.test();
        document.getElementById("demo").innerHTML = str;
        console.info('ArkTS Hello World! :' + str);
    }

        function callArkTS2() {
        let str = testObjName2.test();
        document.getElementById("demo2").innerHTML = str;
        console.info('ArkTS Hello World! :' + str);
    }
       function callArkTS3() {
         let str = testObjName3.test();
        document.getElementById("demo3").innerHTML = str;
        testObjName3.toString(testObjName3.test());
    }


    function callArkTS4() {
          document.getElementById("demo4").innerHTML = 'callArkTS4 function is running';
        testObjName4.test(function(param){testObjName4.toString(param)});
    }


        // 写法1
    class Student {
        constructor(nameList) {
            this.methodNameListForJsProxy = nameList;
        }

        hello(param) {
            testObjName5.toString(param)
        }
    }
    var st = new Student(["hello"])

    // 写法2
    //创建一个构造器，构造函数首字母大写
    function Obj1(){
        this.methodNameListForJsProxy=["hello"];
        this.hello=function(param){
            testObjName5.toString(param)
        };
    }
    //利用构造器，通过new关键字生成对象
    var st1 = new Obj1();

    function callArkTS5() {
      document.getElementById("demo5").innerHTML = 'callArkTS5 function is running';
        testObjName5.test(st);
        testObjName5.test(st1);
    }

 function addItems() {
      var list = document.getElementById("myList");
      for (var i = 0; i < 5; i++) {
        var listItem = document.createElement("li");
        listItem.textContent = "列表项 " + (list.childElementCount + 1);
        list.appendChild(listItem);
      }
    }
</script>
</body>
</html>